<template>
    <el-dialog
        title="选择公司标准模版"
        :visible.sync="dialogVisible"
        width="70%"
    >
        <div>
            <div class="flex-row-center">
                <el-form ref="queryCompanyTemplateForm" :model="queryParams" label-width="auto">
                    <el-form-item label="模版名称">
                        <el-input v-model="queryParams.templateName" placeholder="请输入模版名称"></el-input>
                    </el-form-item>
                </el-form>
                <div class="queryView">
                    <el-button type="primary" @click.stop="handleQuery">搜索</el-button>
                    <el-button @click="resetQuery">重置</el-button>
                </div>
            </div>
            <div>
                <el-table
                    ref="multipleTable"
                    v-loading="loading"
                    :data="list"
                    row-key="customerId"
                    :header-cell-style="{ background: '#FAFAFA', color: '#000000' }" border>
                    <template slot="empty">
                        <el-empty :image-size="50" description="暂无模版信息"></el-empty>
                    </template>
                    <el-table-column label="模版名称" align="center" prop="templateName" min-width="120px" show-overflow-tooltip/>
                    <el-table-column label="产品方案" align="center" prop="planName" min-width="120px" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column label="客户类型" align="center" prop="customerType" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{row}">
                            <dict-tag :options="dict.type.customer_type" :value="row.customersType"/>
                        </template>
                    </el-table-column>
                    <el-table-column label="是否带驾" align="center" prop="leadingTheDriver" min-width="120px" show-overflow-tooltip>
                        <template v-slot="{row}">
                            <dict-tag :options="dict.type.business_yes_no" :value="row.leadingTheDriver"/>
                        </template>
                    </el-table-column>
<!--                    <el-table-column label="客户来源" align="center" prop="customerSource" min-width="120px" show-overflow-tooltip>-->
<!--                        <template v-slot="{row}">-->
<!--                            <dict-tag :options="dict.type.customer_source" :value="row.customerSource"/>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200px" fixed="left">
                        <template v-slot="{row}">
                            <e-button  size="mini" type="text" @click="chooseTemplate(row)"
                            >选择模版</e-button>
                        </template>
                    </el-table-column>
                </el-table>
                <pagination :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
                            @pagination="getList"/>
            </div>

        </div>
    </el-dialog>
</template>

<script>
import {getCustomerList} from "@/api/memberManage/memberList";
import * as contractTemplateApi from "@/api/contractTemplate/contractTemplate"
export default {

    components: {},
    dicts:['customer_type','customer_source', 'business_yes_no'],
    data() {
        return {
            loading:false,
            dialogVisible: false,
            queryParams:{
                pageNum:1,
                pageSize:10,
                templateName:'',
                templateClassification:1,
                approvalStatus:2,
                enablingStatus:1,
                templateType:null,
            },
            total:0,
            list:[],
        }
    },
    computed: {},
    methods: {
        //选择模版
        chooseTemplate(row){
            this.$emit('success', row)
            this.close()
        },
        show(templateType) {
            this.queryParams.templateType = templateType
            this.dialogVisible = true
            this.$nextTick(()=>{
                this.getList()
            })

        },
        close() {
            this.dialogVisible = false
        },
        resetQuery(){
            this.$refs?.queryCompanyTemplateForm?.resetFields()
            this.queryParams.templateName=null
            this.handleQuery()
        },
        handleQuery(){
          this.queryParams.pageNum=1
            this.getList()
        },
        /** 查询测试单表列表 */
        getList() {
            this.loading = true;
            contractTemplateApi.contractTemplateList(this.queryParams).then(res => {
                this.list = res.rows;
                this.total = res.total;
            }).finally(() => {
                this.loading = false
            })

        },

    },
    mounted() {

    },

}
</script>

<style lang="scss" scoped>
.queryView{
    position: relative;
    top: -8px;
    margin-left: 30px;
}
</style>
